.input-container {
    margin-top: var(--spacing-6);

    input,
    textarea {
        height: 44px;
        border-radius: 4px;
        border: 1px solid var(--neutral-200);
        background-color: var(--bg-primary);
        color: var(--text-primary);
        padding: var(--spacing-2);
        margin-top: var(--spacing-1);
        min-width: 320px;
        outline: none;
        transition: border-color 200ms;

        &:focus {
            border-color: var(--neutral-600);
        }

        &.error {
            border: 1px solid var(--red-600);
            color: var(--neutral-900);

            &:focus {
                border-color: var(--red-700);
            }
        }
    }

    textarea {
        width: 100%;
        height: 300px;
        font: var(--sm);
        font-family: monospace;
        resize: none;
        tab-size: 4;
        field-sizing: content;
    }

    .hint {
        color: var(--neutral-400);
        font: var(--sm);
    }

    .error {
        color: var(--red-600);
        font: var(--sm);
    }
}

.form-field-container {
    margin-top: var(--spacing-6);

    label {
        font-weight: 600;
    }
}